<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <title>Carousel</title>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
        
        <!-- Component meta information. -->
        <meta name="HTMLComponent" />
        <meta name="eventUrl" content="http://www.banacek.org/Event.html" />

        <meta scheme="JSONSchema" name="acceptsEvent" content='{
                                                                    "addItem":
                                                                    {
                                                                        "type": "object",
                                                                        "properties":
                                                                        {
                                                                            "id": {"type": "string"},
                                                                            "name": {"type": "string"},
                                                                            "imgUrl": {"type": "string", "format": "url"},
                                                                            "imgHeightToWidthRatio" : {"type": "number"}
                                                                        }
                                                                    }
                                                              }' />
        <meta scheme="JSONSchema" name="raisesEvent" content='{
                                                                    "itemSelected":
                                                                    {
                                                                        "type": "object",
                                                                        "properties":
                                                                        {
                                                                            "id": {"type": "string"}
                                                                        }
                                                                    }
                                                                 }' />
        
        <link rel="stylesheet" type="text/css" href="http://htmlcomponentframework.googlecode.com/svn/releases/1.0/ComponentFramework.css" />
        <link rel="stylesheet" type="text/css" href="Carousel.css" />
        
        <script type="text/javascript" src="http://htmlcomponentframework.googlecode.com/svn/3rdpartylibs/jquery-1.3.2.min.js"></script>
        <script type="text/javascript" src="/libraries/jquery.easing-1.3.js"></script>
        <script type="text/javascript" src="http://htmlcomponentframework.googlecode.com/svn/3rdpartylibs/json2.js"></script>
        <script type="text/javascript" src="http://htmlcomponentframework.googlecode.com/svn/3rdpartylibs/jsonschema-b4.js"></script>
        <script type="text/javascript" src="http://htmlcomponentframework.googlecode.com/svn/releases/1.0/ComponentFramework.js"></script>
        <script type="text/javascript" src="Carousel.js"></script>
        <script type="text/javascript" src="CarouselAnimation.js"></script>
    </head>
    <body>
        <div id="carouselViewport">
            <div id="carouselArea"></div>
        </div>
        <div id="buttonArea">
	        <a id="leftBtn" href="#" onclick="return false;" title="scroll to left"></a>
	        <a id="rightBtn" href="#" onclick="return false;" title="scroll to right"></a>
	    </div>
        <div id="templates">
            <a id="item" href="#"><img class="ImageItem" /></a>
        </div>
    </body>
</html>